<%@ tag language="java" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<%@ attribute name="name" type="java.lang.String" required="true" description="验证码输入框名称"%>
<%@ attribute name="inputCssStyle" type="java.lang.String" required="false" description="验证框样式"%>
<%@ attribute name="imageCssStyle" type="java.lang.String" required="false" description="验证码图片样式"%>
<%@ attribute name="buttonCssStyle" type="java.lang.String" required="false" description="看不清按钮样式"%>
<style>
.login-form .col .icon.vcode {
    background-position: -112px -55px;
}

.login-form .col .vimage{
    position: absolute;
    display: block;
    top: 19px;
    left: 200px;
    background: url(skin_icons.png) no-repeat;
    cursor: pointer;
}
</style>
<input type="text" id="${name}" name="${name}" maxlength="5" class="login-input" placeholder="验证码" title="验证码" style="font-weight:bold;${inputCssStyle}"/>
<label class="icon vcode" for="password"></label>

 <img src="${pageContext.request.contextPath}/servlet/validateCodeServlet" onclick="$('.${name}Refresh').click();" class="vimage ${name}" style="${imageCssStyle}"/>
<a style="display:none;" href="javascript:" onclick="$('.${name}').attr('src','${pageContext.request.contextPath}/servlet/validateCodeServlet?'+new Date().getTime());" class="mid ${name}Refresh" style="${buttonCssStyle}">看不清</a>